<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JSDoc: Source: always-be-playing.js</title>

    <script src="scripts/prettify/prettify.js"> </script>
    <script src="scripts/prettify/lang-css.js"> </script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>

<body>

<div id="main">

    <h1 class="page-title">Source: always-be-playing.js</h1>

    



    
    <section>
        <article>
            <pre class="prettyprint source linenums"><code>/**
 * @file always-be-playing.js
 */
import Ranges from './ranges';
import videojs from 'video.js';

// Set of events that reset the always-be-playing time check logic and clear the timeout
const timerCancelEvents = [
  'seeking',
  'seeked',
  'pause',
  'playing',
  'error'
];

/**
 * @class AlwaysBePlaying
 */
export default class AlwaysBePlaying {
  /**
   * Represents an AlwaysBePlaying object.
   * @constructor
   * @param {object} options an object that includes the tech and settings
   */
  constructor(options) {
    this.tech_ = options.tech;
    this.seekable = options.seekable;
    this.playlist = options.playlist;

    this.consecutiveUpdates = 0;
    this.lastRecordedTime = null;
    this.timer_ = null;
    this.checkCurrentTimeTimeout_ = null;

    if (options.debug) {
      this.logger_ = videojs.log.bind(videojs, 'always-be-playing ->');
    }
    this.logger_('initialize');

    let waitingHandler = () => this.waiting_();
    let cancelTimerHandler = () => this.cancelTimer_();

    this.tech_.on('waiting', waitingHandler);
    this.tech_.on(timerCancelEvents, cancelTimerHandler);
    this.monitorCurrentTime_();

    // Define the dispose function to clean up our events
    this.dispose = () => {
      this.logger_('dispose');
      this.tech_.off('waiting', waitingHandler);
      this.tech_.off(timerCancelEvents, cancelTimerHandler);
      if (this.checkCurrentTimeTimeout_) {
        clearTimeout(this.checkCurrentTimeTimeout_);
      }
      this.cancelTimer_();
    };
  }

  /**
   * Periodically check for timeupdates
   *
   * @private
   */
  monitorCurrentTime_() {
    if (!this.tech_.el_) {
      return;
    }

    this.checkCurrentTime_();

    if (this.checkCurrentTimeTimeout_) {
      clearTimeout(this.checkCurrentTimeTimeout_);
    }

    // 42 = 24 fps // 250 is what Webkit uses // FF uses 15
    this.checkCurrentTimeTimeout_ = setTimeout(this.monitorCurrentTime_.bind(this), 250);
  }

  /**
   * The purpose of this function is to emulate the "waiting" event on
   * browsers that do not emit it when they are waiting for more
   * data to continue playback
   *
   * @private
   */
  checkCurrentTime_() {
    if (this.tech_.paused() || this.tech_.seeking()) {
      return;
    }

    let currentTime = this.tech_.currentTime();

    if (this.consecutiveUpdates >= 5 &amp;&amp;
        currentTime === this.lastRecordedTime) {
      this.consecutiveUpdates++;
      this.waiting_();
    } else if (currentTime === this.lastRecordedTime) {
      this.consecutiveUpdates++;
    } else {
      this.consecutiveUpdates = 0;
      this.lastRecordedTime = currentTime;
      this.seekedAtTime = null;
    }
  }

  /**
   * Cancels any pending timers and resets the 'timeupdate' mechanism
   * designed to detect that we are stalled
   *
   * @private
   */
  cancelTimer_() {
    this.consecutiveUpdates = 0;

    if (this.timer_) {
      this.logger_('cancelTimer_');
      clearTimeout(this.timer_);
    }

    this.timer_ = null;
  }

  /**
   * Handler for `waiting` events from the player
   *
   * @private
   */
  waiting_() {
    let seekable = this.seekable();
    let currentTime = this.tech_.currentTime();
    let playlist = this.playlist();

    if (this.tech_.seeking() ||
        this.timer_ !== null ||
        this.seekedAtTime === currentTime) {
      return;
    }

    // check to see if we fell out of the live window
    if (playlist &amp;&amp;
        !playlist.endList &amp;&amp;
        seekable.length &amp;&amp;
        currentTime &lt; seekable.start(0)) {
      this.seekedAtTime = currentTime;

      let livePoint = seekable.end(seekable.length - 1);

      this.logger_(`Fell out of live window at time ${currentTime}. Seeking to ` +
                   `live point (seekable end) ${livePoint}`);
      this.cancelTimer_();
      this.tech_.setCurrentTime(livePoint);
      return;
    }

    let buffered = this.tech_.buffered();
    let nextRange = Ranges.findNextRange(buffered, currentTime);

    // check for video underflow
    if (nextRange.length === 0) {
      // Even if there is no available next range, there is still a possibility we are
      // stuck in a gap due to video underflow.
      let gap = this.gapFromVideoUnderflow_(buffered, currentTime);

      if (gap) {
        this.logger_(`Encountered a gap in video from ${gap.start} to ${gap.end}. ` +
                     `Seeking to current time ${currentTime}`);
        // Even though the video underflowed and was stuck in a gap, the audio overplayed
        // the gap, leading currentTime into a buffered range. Seeking to currentTime
        // allows the video to catch up to the audio position without losing any audio
        // (only suffering ~3 seconds of frozen video and a pause in audio playback).
        this.cancelTimer_();
        this.tech_.setCurrentTime(currentTime);
      }
      return;
    }

    let difference = nextRange.start(0) - currentTime;

    // check for gap
    this.logger_(`Stopped at ${currentTime}, setting timer for ${difference}, seeking ` +
                 `to ${nextRange.start(0)}`);

    this.timer_ = setTimeout(this.skipTheGap_.bind(this),
                             difference * 1000,
                             currentTime);
  }

  /**
   * Timer callback. If playback still has not proceeded, then we seek
   * to the start of the next buffered region.
   *
   * @private
   */
  skipTheGap_(scheduledCurrentTime) {
    let buffered = this.tech_.buffered();
    let currentTime = this.tech_.currentTime();
    let nextRange = Ranges.findNextRange(buffered, currentTime);

    this.cancelTimer_();

    if (nextRange.length === 0 ||
        currentTime !== scheduledCurrentTime) {
      return;
    }

    this.logger_('skipTheGap_:',
                 'currentTime:', currentTime,
                 'scheduled currentTime:', scheduledCurrentTime,
                 'nextRange start:', nextRange.start(0));

    // only seek if we still have not played
    this.tech_.setCurrentTime(nextRange.start(0) + Ranges.TIME_FUDGE_FACTOR);
  }

  gapFromVideoUnderflow_(buffered, currentTime) {
    // At least in Chrome, if there is a gap in the video buffer, the audio will continue
    // playing for ~3 seconds after the video gap starts. This is done to account for
    // video buffer underflow/underrun (note that this is not done when there is audio
    // buffer underflow/underrun -- in that case the video will stop as soon as it
    // encounters the gap, as audio stalls are more noticeable/jarring to a user than
    // video stalls). The player's time will reflect the playthrough of audio, so the
    // time will appear as if we are in a buffered region, even if we are stuck in a
    // "gap."
    //
    // Example:
    // video buffer:   0 => 10.1, 10.2 => 20
    // audio buffer:   0 => 20
    // overall buffer: 0 => 10.1, 10.2 => 20
    // current time: 13
    //
    // Chrome's video froze at 10 seconds, where the video buffer encountered the gap,
    // however, the audio continued playing until it reached ~3 seconds past the gap
    // (13 seconds), at which point it stops as well. Since current time is past the
    // gap, findNextRange will return no ranges.
    //
    // To check for this issue, we see if there is a gap that starts somewhere within
    // a 3 second range (3 seconds +/- 1 second) back from our current time.
    let gaps = Ranges.findGaps(buffered);

    for (let i = 0; i &lt; gaps.length; i++) {
      let start = gaps.start(i);
      let end = gaps.end(i);

      // gap is starts no more than 4 seconds back
      if (currentTime - start &lt; 4 &amp;&amp; currentTime - start > 2) {
        return {
          start,
          end
        };
      }
    }

    return null;
  }

  /**
   * A debugging logger noop that is set to console.log only if debugging
   * is enabled globally
   *
   * @private
   */
  logger_() {}
}
</code></pre>
        </article>
    </section>




</div>

<nav>
    <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="AlwaysBePlaying.html">AlwaysBePlaying</a></li><li><a href="HlsAudioTrack.html">HlsAudioTrack</a></li><li><a href="HlsHandler.html">HlsHandler</a></li><li><a href="MasterPlaylistController.html">MasterPlaylistController</a></li><li><a href="module.exports.html">exports</a></li><li><a href="PlaylistLoader.html">PlaylistLoader</a></li><li><a href="Representation.html">Representation</a></li><li><a href="SegmentLoader.html">SegmentLoader</a></li><li><a href="SourceUpdater.html">SourceUpdater</a></li><li><a href="Stream.html">Stream</a></li></ul><h3>Global</h3><ul><li><a href="global.html#abort">abort</a></li><li><a href="global.html#addLoader">addLoader</a></li><li><a href="global.html#appendBuffer">appendBuffer</a></li><li><a href="global.html#backwardDuration">backwardDuration</a></li><li><a href="global.html#buffered">buffered</a></li><li><a href="global.html#bufferIntersection">bufferIntersection</a></li><li><a href="global.html#byterangeStr">byterangeStr</a></li><li><a href="global.html#calculateBufferedPercent">calculateBufferedPercent</a></li><li><a href="global.html#checkBuffer_">checkBuffer_</a></li><li><a href="global.html#clamp">clamp</a></li><li><a href="global.html#detectEndOfStream">detectEndOfStream</a></li><li><a href="global.html#dispose">dispose</a></li><li><a href="global.html#duration">duration</a></li><li><a href="global.html#enableFunction">enableFunction</a></li><li><a href="global.html#error">error</a></li><li><a href="global.html#findAdCue">findAdCue</a></li><li><a href="global.html#findGaps">findGaps</a></li><li><a href="global.html#findNextRange">findNextRange</a></li><li><a href="global.html#findRange">findRange</a></li><li><a href="global.html#findSoleUncommonTimeRangesEnd">findSoleUncommonTimeRangesEnd</a></li><li><a href="global.html#formatHexString">formatHexString</a></li><li><a href="global.html#forwardDuration">forwardDuration</a></li><li><a href="global.html#getLoader">getLoader</a></li><li><a href="global.html#getMediaInfoForTime_">getMediaInfoForTime_</a></li><li><a href="global.html#getSegmentBufferedPercent">getSegmentBufferedPercent</a></li><li><a href="global.html#getSyncPoint">getSyncPoint</a></li><li><a href="global.html#getSyncSegmentCandidate_">getSyncSegmentCandidate_</a></li><li><a href="global.html#HlsSourceHandler">HlsSourceHandler</a></li><li><a href="global.html#initSegmentId">initSegmentId</a></li><li><a href="global.html#intervalDuration">intervalDuration</a></li><li><a href="global.html#load">load</a></li><li><a href="global.html#mimeType">mimeType</a></li><li><a href="global.html#objectChanged">objectChanged</a></li><li><a href="global.html#off">off</a></li><li><a href="global.html#on">on</a></li><li><a href="global.html#pause">pause</a></li><li><a href="global.html#paused">paused</a></li><li><a href="global.html#pipe">pipe</a></li><li><a href="global.html#playlist">playlist</a></li><li><a href="global.html#probeSegmentInfo">probeSegmentInfo</a></li><li><a href="global.html#queueCallback_">queueCallback_</a></li><li><a href="global.html#remove">remove</a></li><li><a href="global.html#removeLoader">removeLoader</a></li><li><a href="global.html#renditionSelectionMixin">renditionSelectionMixin</a></li><li><a href="global.html#reset">reset</a></li><li><a href="global.html#resetEverything">resetEverything</a></li><li><a href="global.html#resetLoader">resetLoader</a></li><li><a href="global.html#resolveUrl">resolveUrl</a></li><li><a href="global.html#resyncLoader">resyncLoader</a></li><li><a href="global.html#runCallback_">runCallback_</a></li><li><a href="global.html#safeGetComputedStyle">safeGetComputedStyle</a></li><li><a href="global.html#saveExpiredSegmentInfo">saveExpiredSegmentInfo</a></li><li><a href="global.html#seekable">seekable</a></li><li><a href="global.html#segmentXhrHeaders">segmentXhrHeaders</a></li><li><a href="global.html#setDateTimeMapping">setDateTimeMapping</a></li><li><a href="global.html#sumDurations">sumDurations</a></li><li><a href="global.html#textRange">textRange</a></li><li><a href="global.html#timestampOffset">timestampOffset</a></li><li><a href="global.html#trigger">trigger</a></li><li><a href="global.html#updateMaster">updateMaster</a></li><li><a href="global.html#updateSegments">updateSegments</a></li><li><a href="global.html#updating">updating</a></li><li><a href="global.html#utils">utils</a></li></ul>
</nav>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.4.2</a> on Mon Nov 07 2016 10:42:11 GMT-0500 (EST)
</footer>

<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>
